<template>
    <teleport to=".header">
        <SdyHeader home="home" center="search" />
    </teleport>


    <div class="container">

        <!-- 轮播图 -->
        <sdyBanner />

        <!-- 九宫格分类 -->
        <sdyGrid />

        <!-- 秒杀 + 热门商品 -->
        <sdyHot />

        <!-- 商品列表 -->
        <sdyList />
    </div>
    <!-- 回到顶部按钮 -->
    <van-back-top class="back-top" right="20px" bottom="80px" />
</template>

<script name="sdyHome" lang="ts" setup>
import SdyHeader from '../../components/header.vue'
import sdyBanner from './components/banner.vue'
import sdyGrid from './components/grid.vue'
import sdyHot from './components/hot.vue'
import sdyList from './components/list.vue'

</script>

<style scoped lang="scss">
.container {
    background-color: #F6F6F6;
}
</style>